/**
* 功能描述: 功能可编辑表格样式Demo
* @author 赵常畅
* @date 2022/10/8 18:25
* @version 1.0
*/
<template>
  <div class="yw-table-wrapper" data-v-d95f97a8="">
    <div class="yw-table yw-table-bordered">
      <div class="yw-table-container">
        <div class="yw-table-content">
          <table style="table-layout: auto;">
            <colgroup>
              <col style="width: 25%;">
              <col style="width: 15%;">
              <col style="width: 40%;">
            </colgroup>
            <thead class="yw-table-thead">
              <tr>
                <th class="yw-table-cell" colstart="0" colend="0">name</th>
                <th class="yw-table-cell" colstart="1" colend="1">age</th>
                <th class="yw-table-cell" colstart="2" colend="2">address</th>
                <th class="yw-table-cell" colstart="3" colend="3">operation</th>
              </tr>
            </thead>
            <tbody class="yw-table-tbody">
              <tr data-row-key="0" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">
                    <input type="text" style="margin: -5px 0px;" class="yw-input" data-v-d95f97a8=""></div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">
                    <input type="text" style="margin: -5px 0px;" class="yw-input" data-v-d95f97a8="">
                  </div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">
                    <input type="text" style="margin: -5px 0px;" class="yw-input" data-v-d95f97a8="">
                  </div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a class="yw-typography" data-v-d95f97a8="">Save</a>
                      <a data-v-d95f97a8="">Cancel</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="1" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 1</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 1</div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="2" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 2</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 2</div>
                </td><td class="yw-table-cell">
                <div class="editable-row-operations" data-v-d95f97a8="">
                  <span data-v-d95f97a8="">
                    <a data-v-d95f97a8="">Edit</a>
                  </span>
                </div>
              </td>
              </tr>
              <tr data-row-key="3" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 3</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 3</div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="4" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 4</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 4</div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="5" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 5</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td><td class="yw-table-cell">
                <div data-v-d95f97a8="">London Park no. 5</div>
              </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="6" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 6</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 6</div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="7" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 7</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 7</div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="8" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell"><!---->
                  <div data-v-d95f97a8="">Edrward 8</div>
                </td>
                <td class="yw-table-cell"><!---->
                  <div data-v-d95f97a8="">32</div><!---->
                </td>
                <td class="yw-table-cell"><!---->
                  <div data-v-d95f97a8="">London Park no. 8</div><!---->
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
              <tr data-row-key="9" class="yw-table-row yw-table-row-level-0">
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">Edrward 9</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">32</div>
                </td>
                <td class="yw-table-cell">
                  <div data-v-d95f97a8="">London Park no. 9</div>
                </td>
                <td class="yw-table-cell">
                  <div class="editable-row-operations" data-v-d95f97a8="">
                    <span data-v-d95f97a8="">
                      <a data-v-d95f97a8="">Edit</a>
                    </span>
                  </div>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "index"
}
</script>

<style scoped>

</style>